import { message } from '@/utils/message'
import { ref, watch } from 'vue'
import { useDicts } from '@/utils/dict'
import type { FormInstance } from 'element-plus'
import { dataScope } from '@/api/system/role'
export function useDataScopeForm(props, emit) {
  const dataScopeOptions = ref([
    { value: '1', label: '全部数据权限' },
    { value: '2', label: '自定数据权限' },
    { value: '3', label: '本部门数据权限' },
    { value: '4', label: '本部门及以下数据权限' },
    { value: '5', label: '仅本人数据权限' },
  ])

  const title = ref(props.title)
  const formData = ref(props.data)
  const deptOptions = ref(props.deptOptions)
  const deptRef = ref(null)
  const deptExpand = ref(true)
  const deptNodeAll = ref(false)
  const formVisible = ref(false)
  const ruleFormRef = ref<FormInstance>()
  const { sys_normal_disable } = useDicts('sys_normal_disable')

  /** 选择角色权限范围触发 */
  function dataScopeSelectChange(value) {
    if (value !== '2') {
      deptRef.value.setCheckedKeys([])
    }
  }

  /** 树权限（展开/折叠）*/
  const handleCheckedTreeExpand = (value, type) => {
    if (type == 'dept') {
      const treeList = deptOptions.value
      for (let i = 0; i < treeList.length; i++) {
        deptRef.value.store.nodesMap[treeList[i].id].expanded = value
      }
    }
  }

  /** 树权限（全选/全不选） */
  const handleCheckedTreeNodeAll = (value, type) => {
    if (type == 'dept') {
      deptRef.value.setCheckedNodes(value ? deptOptions.value : [])
    }
  }

  /** 树权限（父子联动） */
  const handleCheckedTreeConnect = (value, type) => {
    if (type == 'dept') {
      formData.value.deptCheckStrictly = value ? true : false
    }
  }

  /** 所有部门节点数据 */
  function getDeptAllCheckedKeys() {
    // 目前被选中的部门节点
    const checkedKeys = deptRef.value.getCheckedKeys()
    // 半选中的部门节点
    const halfCheckedKeys = deptRef.value.getHalfCheckedKeys()
    checkedKeys.unshift(...halfCheckedKeys)
    return checkedKeys
  }

  /** 提交按钮（数据权限） */
  function submitDataScope() {
    if (formData.value.roleId != undefined) {
      formData.value.deptIds = getDeptAllCheckedKeys()
      dataScope(formData.value).then(() => {
        message('修改成功', { type: 'success' })
        formVisible.value = false
      })
    }
  }

  /* 关闭弹窗 */
  const closeDialog = () => {
    formVisible.value = false
    resetForm(ruleFormRef.value)
  }

  /** 重置表单  */
  const resetForm = (formEl: FormInstance | undefined) => {
    if (!formEl) return
    formEl.resetFields()
  }

  watch(
    () => formVisible.value,
    (val) => {
      emit('update:visible', val)
    }
  )

  watch(
    () => props.visible,
    (val) => {
      formVisible.value = val
    }
  )

  watch(
    () => props.title,
    (val) => {
      title.value = val
    }
  )

  watch(
    () => props.data,
    (val) => {
      formData.value = val
    }
  )

  watch(
    () => props.deptOptions,
    (val) => {
      deptOptions.value = val
    }
  )

  return {
    title,
    formData,
    deptRef,
    deptExpand,
    deptOptions,
    deptNodeAll,
    formVisible,
    dataScopeOptions,
    sys_normal_disable,
    closeDialog,
    submitDataScope,
    dataScopeSelectChange,
    handleCheckedTreeExpand,
    handleCheckedTreeNodeAll,
    handleCheckedTreeConnect,
  }
}
